<!--科室模块-->
<template>
  <div class="dept">
    <el-row>
      <el-col :span="14">
        <!--  科室预约-->
        <el-col style="box-shadow:rgba(0,0,0,.3) 0px 0px 10px;margin-top:20px">
          <div class="headStyle">
            <el-col :span="3">科室前台</el-col>
            <!-- <el-col :span="3" style="margin-top: -5px;"><el-button @click="moreClick">更多</el-button></el-col> -->
            <el-col :span="1" :offset="20">
              <i class="el-icon-more" />
              <div>
                <el-button @click="moreClick">更多</el-button>
              </div>
            </el-col>
          </div>
          <el-col style="margin:20px;">
            <el-button-group>
              <el-button @click="titleClick('分诊')">分诊</el-button>
              <el-button @click="titleClick('预约')">预约</el-button>
            </el-button-group>
          </el-col>
          <div class="headStyle">
            <el-table v-show="moneyBtn === '分诊'" v-loading="loading" :data="deptTriage.dto" border :row-class-name="tableColor">
              <el-table-column label="顾客" prop="customerName" :show-overflow-tooltip="true" />
              <el-table-column label="性别" prop="customerSex" :show-overflow-tooltip="true" />
              <el-table-column label="项目类型" prop="intentCaseType" :show-overflow-tooltip="true" />
              <el-table-column label="项目" prop="intentCaseName" :show-overflow-tooltip="true" />
              <el-table-column label="主治医生" prop="faceDoctorName" :show-overflow-tooltip="true" />
              <el-table-column label="前面人数" prop="waitMan" :show-overflow-tooltip="true" />
              <el-table-column label="已等时间" prop="waitTime" :show-overflow-tooltip="true" />
              <el-table-column label="操作" min-width="120">
                <template slot-scope="{ row }">
                  <el-button type="text" @click="toSendBtnTriageBtn(row)">改派</el-button>
                  <el-button type="text" @click="cancelTriageBtn(row.id)">取消</el-button>
                </template>
              </el-table-column>
            </el-table>
            <el-table v-show="moneyBtn === '预约'" v-loading="loading" :data="deptAppointment.dto" border :row-class-name="tableColor">
              <el-table-column label="顾客" prop="customerName" :show-overflow-tooltip="true" />
              <el-table-column label="性别" prop="customerSex" :show-overflow-tooltip="true" />
              <el-table-column label="预约时间" prop="appointmentTime" min-width="120" :show-overflow-tooltip="true" />
              <el-table-column label="项目" prop="projectName" :show-overflow-tooltip="true" />
              <el-table-column label="接待人" prop="receiverName" :show-overflow-tooltip="true" />
              <el-table-column label="剩余时间" prop="remainingTime" :show-overflow-tooltip="true" />
              <el-table-column label="操作" min-width="120">
                <template slot-scope="{ row }">
                  <el-button type="text" @click="signInBtn(row)">签到</el-button>
                  <el-button type="text" @click="cancelBtn(row)">取消预约</el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </el-col>
        <!--治疗任务-->
        <el-col class="headStyle" style="box-shadow:rgba(0,0,0,.3) 0px 0px 10px;">
          <div class="span-y">
            <el-col :span="3">治疗任务</el-col>
            <!-- <el-col :span="3">更多</el-col> -->
            <el-col :span="1" :offset="20">
              <i class="el-icon-more" />
              <div>
                <el-button>更多</el-button>
              </div>
            </el-col>
          </div>
          <div class="headStyle">
            <el-table v-loading="loadings" :data="cureTask.dto">
              <el-table-column label="顾客" prop="customerName" />
              <el-table-column label="性别" prop="customerSex" />
              <el-table-column label="项目名称" prop="projectName" />
              <el-table-column label="主治医生" prop="doctor" />
              <el-table-column label="状态" prop="status" />
              <el-table-column label="操作" min-width="150">
                <template slot-scope="scope">
                  <div>
                    <el-button type="text" @click="drawBtn(scope.row)">划扣</el-button>
                    <el-button v-if="scope.row.productAttributes === '美容项目' || scope.row.productAttributes === '手术项目'" type="text" @click="medicalBtn(scope.row)">写病历</el-button>
                    <el-button v-if="scope.row.productAttributes === '美容项目' || scope.row.productAttributes === '手术项目'" type="text" @click="prescriptionBtn(scope.row)">开处方</el-button>
                    <el-button type="text" @click="orderBtn(scope.row)">开单</el-button>
                    <el-button type="text" @click="completeTreatmentBtn(scope.row.triageId)">完成治疗</el-button>
                  </div>
                </template>
              </el-table-column>
            </el-table>
            <DrawDialog ref="addCureRef" :title="title" :text-btn="textBtn" :visible.sync="drawVisible" @success="getCureTaskList" />
            <MedicalDialog ref="addMedicalRef" :title="title" :visible.sync="medicalVisible" :reveal="reveal" @success="getCureTaskList" />
            <PrescriptionDialog ref="addPrescriptionRef" :title="title" :visible.sync="prescriptionVisible" :reveal="reveal" @success="getCureTaskList" />
            <Billing v-if="billing" ref="billing" :billing-data="billingData" @cancels="billing = false" />
          </div>
        </el-col>
      </el-col>
    </el-row>
    <el-row />
    <Dialog ref="addSubscribeRef" :visible.sync="visible" :title="title" :test-btn="textBtn" :flag.sync="flag" @success="getDeptAppointmentList" />
    <Add-triage v-if="show" ref="addTriageRef" :show.sync="show" :visible.sync="visibles" :title="title" :test-btn="textBtn" @success="getDeptTriageList" />
  </div>
</template>

<script>
import DrawDialog from "../../department/diagnose/curetask/drawDialog";
import MedicalDialog from "../../department/diagnose/curetask/medicalDialog";
import PrescriptionDialog from "../../department/diagnose/curetask/prescriptionDialog";
import Billing from "../../lobby/doctor/billing";
import Dialog from "@/views/department/center/subscribe/dialog";
import AddTriage from "@/views/department/center/triage/dialog";
import { tableColor } from '@/utils/common.js';
export default {
  name: "Dept",
  components: {
    DrawDialog,
    MedicalDialog,
    PrescriptionDialog,
    Billing,
    Dialog,
    AddTriage,
  },
  data() {
    return {
      deptAppointment: {},
      deptTriage: {},
      cureTask: {},
      loading: false,
      tableColor,
      loadings: false,
      type: "",
      moneyBtn: "分诊",
      title: "",
      textBtn: "",
      reveal: true,
      billing: false, // 开单
      billingData: {},
      searchForm: {},
      drawVisible: false,
      medicalVisible: false,
      prescriptionVisible: false,
      visibles: false,
      visible: false,
      flag: false,
      show: false,
    };
  },
  created() {
    this.searchForm.deptId = this.$store.getters.currentUserInfo.deptUsrList[0].deptId;
    this.getDeptTriageList();
    this.getCureTaskList();
  },
  methods: {
    async getDeptAppointmentList() {
      this.loading = true;
      const res = await this.$api['workbench/workbench/appointmentList']({ query: { deptId: this.$store.getters.currentUserInfo.deptUsrList[0].deptId ? this.$store.getters.currentUserInfo.deptUsrList[0].deptId : 0 }});
      this.loading = false;
      if (res.code !== 200) return this.$message.error('查询预约列表失败！');
      this.deptAppointment = res.data;
    },
    async getDeptTriageList() {
      this.loading = true;
      const res = await this.$api['workbench/workbench/triageList']({ query: { deptId: this.$store.getters.currentUserInfo.deptUsrList[0].deptId ? this.$store.getters.currentUserInfo.deptUsrList[0].deptId : 0 }});
      this.loading = false;
      if (res.code !== 200) return this.$message.error('查询分诊列表失败！');
      this.deptTriage = res.data;
    },
    async getCureTaskList() {
      this.loadings = true;
      const res = await this.$api['workbench/workbench/workBenchTaskList']();
      this.loadings = false;
      if (res.code !== 200) return this.$message.error('查询治疗任务列表失败！');
      this.cureTask = res.data;
    },
    titleClick(title) {
      this.moneyBtn = title;
      if (title === '分诊') {
        this.getDeptAppointmentList();
      } else {
        this.getDeptTriageList();
      }
    },
    // 签到
    async signInBtn(row) {
      this.title = "预约签到";
      this.textBtn = "签到并分诊";
      this.flag = true;
      this.visible = true;
      this.$refs.addSubscribeRef.signInBtn(row, this.searchForm);
    },
    // 取消预约
    cancelBtn(row) {
      this.title = "取消预约";
      this.textBtn = "提交";
      this.flag = true;
      this.visible = true;
      this.$refs.addSubscribeRef.cancelBtn(row, this.searchForm);
    },
    // 改派
    toSendBtnTriageBtn(row) {
      this.title = "修改分诊";
      this.textBtn = '提交';
      this.visibles = true;
      this.show = true;
      this.$nextTick(function() {
        this.$refs.addTriageRef.toSendBtnTriage(JSON.parse(JSON.stringify(row)));
      });
    },
    // 取消
    async cancelTriageBtn(id) {
      const confirmResult = await this.$confirm('请确认是否取消?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).catch((err) => err);
      if (confirmResult !== 'confirm') return this.$message.info('已撤回取消操作！');
      const res = await this.$api['reception/triage/cancel']({ id: id });
      if (res.code !== 200) return this.$message.error('取消失败！');
      this.$message.success('取消成功！');
      this.getDeptTriageList();
    },
    moreClick() {
      if (this.moneyBtn === '分诊') {
        this.$router.push({ path: "/swan/department/center/triage" });
      } else {
        this.$router.push({ path: "/swan/department/center/subscribe" });
      }
    },
    // 划扣
    async drawBtn(row) {
      this.title = "划扣";
      this.textBtn = "提交";
      this.drawVisible = true;
      this.$refs.addCureRef.drawBtn(row);
    },
    // 写病历
    medicalBtn(row) {
      this.title = "写病历";
      this.reveal = false;
      this.medicalVisible = true;
      this.$refs.addMedicalRef.medicalBtn(row);
    },
    // 开处方
    prescriptionBtn(row) {
      this.title = "开处方";
      this.reveal = false;
      this.prescriptionVisible = true;
      this.$refs.addPrescriptionRef.prescriptionBtn(row);
    },
    // 开单
    orderBtn(row) {
      this.billingData = {
        customerId: row.customerId,
        customerName: row.customerName,
        orderPaymentStyle: "全款",
        customerPhone: row.customerPhone,
        customerCode: row.customerCode,
      };
      this.billing = true;
      this.$nextTick(() => {
        this.$refs.billing.init();
      });
    },
    // 完成治疗
    async completeTreatmentBtn(id) {
      const res = await this.$api["department/projectmenu/FinishDeptProjedtTask"]({ id });
      if (res.code !== 200) return this.$message.error("操作失败！");
      this.getCureTaskList();
    },
  },
};
</script>
<style lang="scss" scoped>
.headStyle{
  margin-top: 20px;
  padding: 10px;
}
@import '../css/reception.scss';
.span-y{
  padding-top: 20px;
}
</style>
